Rollover Image Link

This page contains examples that illustrates the result of using the JavaScript topic Rollover Image Link in PageSpinner's HTML Assistant.

Before starting the Assistant, you need to have at least two images that will be used in the link. In the first example we use the following two images:

Welcome 1
This image is used as the original image of the link.
Welcome 2 This image is used as the rollover image, and is displayed when the user moves the mouse pointer over the original image.

After performing the three steps in the HTML Assistant's Rollover Image JavaScript topic, we get the following rollover image link without writing any code; everything is created and inserted by the Assistant:

Click here!


You can also choose to use three images. The third image will be displayed when user clicks the Image link in version 4.0 and later of the major browsers.

Note that it may take some time to load the images if the viewer has a slow connection, so if you are using many images it is a good idea to make them relatively small.

Welcome 1
This image is used as the original image of the link.
Welcome 2 This image is used as the rollover image, and is displayed when the user moves the mouse pointer over the original image.
Welcome 3 This image is displayed when the user clicks the image.

Below is an example of the result you can get when using a third image. Version 4.0 or later of the major browsers is required to display the third image, but adding the third image will not cause much of a problem in most of the earlier browser versions.

Click and hold!